export const todoFormComp = {
  template: `
    <div ng-controller="TodoForm">
      <h1 class="title">TodoList</h1>
      <input
        type="text"
        placeholder="Input some..."
        ng-model="todoText"
      />
      <button ng-click="addTodo()">Add</button>
    </div>
  `
};

export const todoListComp = {
  template: `
    <ul ng-controller="TodoList">
      <li ng-repeat="todo in $root.todoData">
        <input
          type="checkbox"
          ng-checked="todo.completed"
          ng-click="toggleTodo(todo.id)"
        />
        <span ng-class="{ 'completed': todo.completed }">{{ todo.content }}</span>
        <button ng-click="removeTodo(todo.id)">Delete</button>
        </li>
    </ul>
  `
};
